<template>
   <div class="layout-footer-banner">
            <div class="layout-footer-index container">
                <!-- <div class="layout-footer-help"> -->
                    <Row >
                    <Col span="4" class="layout-footer-help">
                    <div class="layout-footer-logo bg" :style="{backgroundImage:'url('+logo+')'}"></div>
                    <p class="layout-footer-service">客服热线：</p>
                    <p class="layout-footer-tele">400-820-8813</p>
                    <p class="layout-footer-service">周一至周五9:00-17:00</p>
                    <p class="layout-footer-service">邮箱：6481918@qq.com</p></Col>
                <!-- </div> -->
                    <Col span="4"> 
                        <dl class="layout-footer-group">
                        <dt ><router-link :to="{path:'/index/find_demand'}" class="layout-footer-title"> 需求和服务</router-link></dt>
                            <dd ><router-link :to="{path:'/index/find_demand'}" class="layout-footer-service"> 找需求</router-link></dd>
                            <dd ><router-link :to="{path:'/index/find_service'}" class="layout-footer-service">找服务</router-link></dd>
                            <dd ><router-link :to="{path:'/index/specialservice_list'}" class="layout-footer-service">平台服务</router-link></dd>
                        </dl>
                    </Col>
                <Col span="4">     
                <dl class="layout-footer-group">
                    <dt ><router-link :to="{path:'/index/find_agen_com'}" class="layout-footer-title"> 企业机构</router-link></dt>
                     <dd ><router-link :to="{path:'/index/find_agen_com?rtype=5'}" class="layout-footer-service">服务机构</router-link></dd>
                        <dd ><router-link :to="{path:'/index/find_agen_com?rtype=4'}" class="layout-footer-service">企业</router-link></dd>
                    </dl>
                </Col>
                    <Col span="4">     
                        <dl class="layout-footer-group">
                            <dt><a class="layout-footer-title">友情链接</a></dt>
                            <dd><a v-for="item in friendly_link" :href="item.url" target="_blank" class="layout-footer-service">{{ item.name }}<br></a></dd>
                        </dl>
                    </Col>
                    <Col span="4">  
                        <dl class="layout-footer-group ">
                            <dt><a class="layout-footer-title">文章资讯</a></dt>
                            <dd><router-link :to="{path:'/index/article/list/notice/*'}" class="layout-footer-service">通知公告</router-link></dd>
                            <dd><router-link :to="{path:'/index/article/list/news/*'}" class="layout-footer-service">新闻资讯</router-link></dd>
                            <dd><router-link :to="{path:'/index/article/list/laws/*'}" class="layout-footer-service">政策法规</router-link></dd>
                        </dl>
                    </Col>
                    <Col span="4">  
                <dl class="layout-footer-group layout-footer-last">
                        <dt><a class="layout-footer-title">帮助中心</a></dt>
                        <dd><router-link :to="{path:'/index/about'}" class="layout-footer-service">平台简介</router-link></dd>
                        <dd><router-link :to="{path:'/index/help'}" class="layout-footer-service">帮助文档</router-link></dd>
                        <dd ><router-link :to="{path:'/index/question'}" class="layout-footer-service">问题反馈</router-link></dd>
                </dl> 
                </Col>
                </Row>
            </div>
            <MainFooterInfo></MainFooterInfo>
            <div style="height: 20px; width: 100%; background-color: #000; color: #fff; text-align: center;">本网站需要IE8以上浏览器版本！</div>
    </div> 
</template>
<script>
import MainFooterInfo from "./footer_info";
export default {
    name: "MainFooter",
    data () {
        return {    
        }
    },
    computed: {
        friendly_link() {
            return this.$store.state.app.dicTree.friendly_link.children;
        },
        logo(){
            var index_logo = this.$store.state.app.dicTree.index_logo;
            if(index_logo.children.length > 0 && index_logo.children[0].logo.length > 0) {
                return this.$store.state.app.dicTree.index_logo.children[0].logo[0].url;
            } else return "";
        },
    },
    components: {
        MainFooterInfo
    }
}
</script>
<style scoped>
       /* 最后的友情链接等内容 */
.layout-footer-banner{
    width: 100%;
    height: 200px;
    background-color: #f1f1f1;
}
.layout-footer-index{
    width: 53%;
    height: 200px;
    margin: 0 auto;
    padding:30px 0;
    min-width: 960px;

}
.layout-footer-group{
    width: 100%;
    height: 130px;
    float: left;
    padding-left:20px;
     border-left: 1px solid #f8f6f6;
    border-right: 1px solid #cdcdcd;
}
.layout-footer-help{
    border-right: 1px solid #cdcdcd;
    height: 130px;
}
.layout-footer-logo{
    background-color: #999;
    width: 60%;
    height: 35px;
    font-size: 1rem;
    
}
.layout-footer-service{
    height: 22px;
    line-height: 22px;
    padding: 2px;
    font-family:"微软雅黑";
    color:#666;
    text-decoration: none;
}
.layout-footer-tele{
    height: 28px;
    line-height: 28px;
    font-weight:700;
    font-size: 1.5rem;
    color:#666666;
}
.layout-footer-title{
    color: rgb(124, 119, 119);
    font-weight:700;
    line-height: 22px;
    font-size:.8rem;
    padding-bottom:8px;
    text-decoration: none;
}
.layout-footer-last{
    border-right: none;
}
.layout-footer-center{
    text-align: center;
}
.font-red{
    color: #e92322;
} 
.bolder{
    margin: 0 5px;
}
.bg{
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center center;
}
</style>
